<template>
    <el-dialog v-model="props.frameValue" title="选择操作文件夹名称" width="500" :before-close="handleClose">
         <span>
            <el-select v-model="value" placeholder="请选择正确的类" size="large" style="width: 240px">
                <el-option v-for="item in $store.state.UserName" :key="item" :label="item" :value="item" />
            </el-select>       
        </span>
         <template #footer>
             <div class="dialog-footer">
                 <el-button @click="cancel">取消</el-button>
                 <el-button type="primary" @click="confirm">
                     确定
                 </el-button>
             </div>
         </template>
     </el-dialog>
 </template>
 
 <script setup>
 import { ref } from 'vue'
 import { sendFile } from '../api/create_folder.js'
 import { useStore } from 'vuex'
 import { useRouter } from 'vue-router'
 import { ElMessage } from 'element-plus'

const store = useStore()
const router = useRouter()
 
 const props = defineProps({
    frameValue: Boolean
 })
  
 const value = ref('')
//  console.log(store.state.UserName)
 const options = store.state.UserName.value

 const emits = defineEmits(['ChangeFrameVisible'])
 
 const cancel = () => {
       emits('ChangeFrameVisible')
 }
 
 const confirm = async() => {
    const res = await sendFile(value.value)
    console.log(res.data)
    if(res.data !== ''){
        ElMessage({
             message: '选择成功，请开始扫描',
             type: 'success',
             offset: 50
        })
        store.commit('giveName',res.data)
        router.push('/scan')
        emits('ChangeFrameVisible')
    }else{
        ElMessage.error('选择失败，请重新选择')
    }
    
 }
 
 const handleClose = () => {
       emits('ChangeFrameVisible')
 }

 </script>

<style scoped>
</style>